<template>
  <div class="app-container">
    <el-tabs type="card" @tab-click="handleClick" v-model="tabValue">
      <el-tab-pane  name="all" label="全部企业" lazy>
        <uc-table url="admin/displayList/getHasCheckEnterPriseList" name="主体信息" ref="all" pageable table-border :search-form="searchForm">
          <template slot="searchForm">
            <el-form size="mini" :inline="true" :model="searchForm" class="demo-form-inline filter-container">
              <!--搜索输入框-->
              <el-form-item >
                <el-input type="text" v-model="searchForm.name" placeholder="请输入主体名称" clearable @clear="clearInput()"></el-input>
              </el-form-item>
              <!--搜索按钮--新增按钮-->
              <el-form-item>
                <el-button type="primary" icon="el-icon-search" class="filter-item" @click="handleSearch(all)">查询</el-button>
              </el-form-item>
            </el-form>
          </template>
          <template slot="columns">
            <el-table-column prop="name" label="主体名称" align="left"></el-table-column>

            <el-table-column prop="dominantType" label="主体类型" align="left">
              <template slot-scope="scope">
                {{scope.row.dominantType | enterpriseType}}
              </template>
            </el-table-column>
            <el-table-column prop="contacts" label="联系人" align="left"></el-table-column>
            <el-table-column prop="mobile" label="联系人电话" align="left"></el-table-column>
            <el-table-column prop="tel" label="主体固话" align="left"></el-table-column>
            <el-table-column prop="address" label="操作" width="100px" align="left" class-name="small-padding fixed-width">
              <template slot-scope="scope">
                <el-button size="mini" icon="el-icon-edit" type="primary" @click="viewException(scope.row)">查看异常</el-button>
              </template>
            </el-table-column>
          </template>
        </uc-table>
      </el-tab-pane>
      <el-tab-pane  name="ifire" label="有异常企业" lazy>
        <uc-table url="admin/displayList/getHasCheckEnterPriseList" name="主体信息" ref="ifire" pageable table-border :search-form="searchForm">
          <template slot="searchForm">
            <el-form size="mini" :inline="true" :model="searchForm" class="demo-form-inline filter-container">
              <!--搜索输入框-->
              <el-form-item>
                <el-input type="text" v-model="searchForm.name" placeholder="请输入主体名称" clearable @clear="clearInput()"></el-input>
              </el-form-item>
              <!--搜索按钮--新增按钮-->
              <el-form-item>
                <el-button type="primary" icon="el-icon-search" class="filter-item" @click="handleSearch(ifire)">查询</el-button>
              </el-form-item>
            </el-form>
          </template>
          <template slot="columns">
            <el-table-column prop="name" label="主体名称" align="left"></el-table-column>
            <el-table-column prop="dominantType" label="主体类型" align="left">
              <template slot-scope="scope">
                {{scope.row.dominantType | enterpriseType }}
              </template>
            </el-table-column>
            <el-table-column prop="contacts" label="联系人" align="left"></el-table-column>
            <el-table-column prop="mobile" label="联系人电话" align="left"></el-table-column>
            <el-table-column prop="tel" label="企业固话" align="left"></el-table-column>
            <el-table-column prop="address" label="操作" width="100px" align="left" class-name="small-padding fixed-width">
              <template slot-scope="scope">
                <el-button size="mini" icon="el-icon-edit" type="primary" @click="viewException(scope.row)">查看异常</el-button>
              </template>
            </el-table-column>
          </template>
        </uc-table>
      </el-tab-pane>
      <el-tab-pane  name="enter" label="无异常企业" lazy>
        <uc-table url="admin/displayList/getHasCheckEnterPriseList" name="主体信息" ref="enter" pageable table-border :search-form="searchForm">
          <template slot="searchForm">
            <el-form size="mini" :inline="true" :model="searchForm" class="demo-form-inline filter-container">
              <!--搜索输入框-->
              <el-form-item>
                <el-input type="text" v-model="searchForm.name" placeholder="请输入主体名称" clearable @clear="clearInput()"></el-input>
              </el-form-item>
              <!--搜索按钮--新增按钮-->
              <el-form-item>
                <el-button type="primary" icon="el-icon-search" class="filter-item" @click="handleSearch(enter)">查询</el-button>
              </el-form-item>
            </el-form>
          </template>
          <template slot="columns">
            <el-table-column prop="name" label="主体名称" align="left"></el-table-column>
            <el-table-column prop="dominantType" label="主体类型" align="left">
              <template slot-scope="scope">
                {{scope.row.dominantType | enterpriseType }}
              </template>
            </el-table-column>
            <el-table-column prop="contacts" label="联系人" align="left"></el-table-column>
            <el-table-column prop="mobile" label="联系人电话" align="left"></el-table-column>
            <el-table-column prop="tel" label="企业固话" align="left"></el-table-column>
            <el-table-column prop="address" label="操作" width="100px" align="left" class-name="small-padding fixed-width">
            <template slot-scope="scope">
                <el-button size="mini" icon="el-icon-edit" type="primary" @click="viewException(scope.row)">查看异常</el-button>
            </template>

            </el-table-column>
          </template>
        </uc-table>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import UcTable from "@/components/UcTable/index.vue";
import {deleteInEnterpriseDominant} from "@/api/enterpriseDominant";
export default {
  name: "enterpriseList",
  components: {UcTable},
  data(){
    return{
      searchForm:{
        deleted:false,
        hasCheck:0
      },
      deleteLoading:false,
      tabValue:"all",
      tabOptions:[
        {
          name:'all',
          label:"全部企业",
          ref:'allTable'
        },
        {
          name:'ifire',
          label:"有异常企业",
          ref:'ifire'
        },
        {
          name:'enter',
          label:"无异常企业",
          ref:'enter'
        }
      ],
      all:"all",
      ifire:"ifire",
      enter:"enter",

    }
  },
  computed:{

  },
  methods:{
    handleSearch(val){
      this.$refs[val].getTableData(1)
    },
    viewException(val){
      this.$router.push("/maintenance/checkRecordsList?enterpriseId="+val.ucId)
    },
    clearInput(){
      //清除输入框
      this.searchForm.name = null
      this.handleSearch(this.tabValue)
    },
    handleClick(val){
      if (val.name=="all"){
        this.searchForm.hasCheck = 0
        this.handleSearch(this.tabValue)
      }else if (val.name=="ifire"){
        this.searchForm.hasCheck = 1
        this.handleSearch(this.tabValue)
      }else {
        this.searchForm.hasCheck = 2
        this.handleSearch(this.tabValue)
      }
    }
  }
}
</script>

<style scoped>

</style>